<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/swiper-bundle.min.css">
    <script src="./js/jQuery.min.js"></script>
    <script src="./js/swiper-bundle.min.js"></script>


</head>

<body>
    <!-- 头部导航栏部分 -->
    <header>
        <div class="nav">
            <div class="log">
                <img src="./img/logonew.png" alt="">
            </div>
            <div class="navList">
                <ul>
                    <li><a href="./index.html" class="active">首页</a></li>
                    <li><a href="./kw.html" target="_blank">酷玩</a></li>
                    <li><a href="./guide.html" target="_blank">导购</a></li>
                    <li><a href="./try.html" target="_blank">试用</a></li>
                    <li><a href="./report.html" target="_blank">报告</a></li>
                </ul>
            </div>
            <div class="fr">
                <div class="search"><img src="./img/search.png" alt=""></div>
                <button>注册</button>
            </div>
        </div>
    </header>
    <!-- banner部分 -->
    <div class="banner">
        <div class="wrap bannerBox">
            <div class="text">
                <h3>幻响小贝HiFi2.1音响</h3>
                <div>
                    <span>126人申请</span>
                    <span>￥599</span>
                    <span>20台</span>
                </div>
                <p>申请时间剩余：13天5小时37分钟</p>
                <div class="shenqing">
                    立即申请
                </div>
            </div>
        </div>
    </div>
    <!-- 热门试用 轮播图部分 -->
    <div class="wrap">
        <h1 class="hot">热门试用</h1>
        <!-- Swiper -->
        <div class="swiper mySwiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot9.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot8.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot7.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot6.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot5.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot4.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot3.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="item">
                        <img src="./img/hot2.jpg" alt="">
                        <h4>巴慕达 The Toaster 烤面包机</h4>
                        <span class="item_num">2032</span><span class="item_num">20台</span>
                        <p><span>1392</span>申请</p>
                        <p class="p">剩余时间2天</p>
                    </div>
                </div>

            </div>
            <!-- <div class="swiper-pagination"></div> -->
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>

    </div>
    <!-- 报告精选 -->
    <div class="report">
        <div class="wrap">
            <div class="rpTitle">
                <p>报告精选</p>
                <span class="more">查看更多→</span>
            </div>
            <div class="kwBox">
                <div class="products">
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItem01">
                        <img src="./img/bg3.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author author01">
                            <span>@苏苏</span>
                            <div class="zan">
                                <span><img src="./img/zan.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 导购部分 -->
    <div class="wrap">
        <div class="rpTitle">
            <p>导购精选</p>
            <span>查看更多→</span>
        </div>
        <div class="products">
            <div class="prdItem prdItem02">
                <img src="./img/bg2.jpg" alt="">
                <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                <div class="author author02">
                    <span></span>
                    <div class="zan">
                        <span><img src="./img/zan.png" alt="">3</span>
                        <span><img src="./img/reply.png" alt="">3</span>
                    </div>
                </div>
            </div>
            <div class="prdItem prdItem02">
                <img src="./img/bg2.jpg" alt="">
                <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                <div class="author author02">
                    <span></span>
                    <div class="zan">
                        <span><img src="./img/zan.png" alt="">3</span>
                        <span><img src="./img/reply.png" alt="">3</span>
                    </div>
                </div>
            </div>
            <div class="prdItem prdItem02">
                <img src="./img/bg2.jpg" alt="">
                <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                <div class="author author02">
                    <span></span>
                    <div class="zan">
                        <span><img src="./img/zan.png" alt="">3</span>
                        <span><img src="./img/reply.png" alt="">3</span>
                    </div>
                </div>
            </div>
            <div class="prdItem prdItem02">
                <img src="./img/bg2.jpg" alt="">
                <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                <div class="author author02">
                    <span></span>
                    <div class="zan">
                        <span><img src="./img/zan.png" alt="">3</span>
                        <span><img src="./img/reply.png" alt="">3</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 发现酷玩 -->
    <div class="report">
        <div class="wrap">
            <div class="rpTitle">
                <p>发现酷玩</p>
                <span class="more">查看更多→</span>
            </div>
            <div class="kwBox">
                <div class="products">
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>
                    <div class="prdItem prdItemKw">
                        <img src="./img/k4.jpg" alt="">
                        <p>空气净化器里面学问多得惊呆你,你选对了吗?</p>
                        <div class="author">
                            <span class="price">￥ 1212</span>
                            <div class="zan">
                                <span><img src="./img/xinRedo.png" alt="">3</span>
                                <span><img src="./img/reply.png" alt="">3</span>
                            </div>
                        </div>
                    </div>


                </div>
            </div>
        </div>
        <!-- 加载更多 -->
        <div class="wrap">

            <div class="load">
                <img src="./img/more.png" alt="">
                点击加载更多......
            </div>
        </div>
    </div>
    <!-- 页脚 -->
    <footer>
        <div class="wrap">

            <div class="down-box">
                <div class="inner">
                    <div class="fix">
                        <dl>
                            <img src="./img/code.png" alt="" width="160" height="160">
                        </dl>
                        <dl>
                            <dt>
                                <img src="./img/logoImg.jpg" alt="">
                            </dt>
                            <dd>全球酷玩导购试用平台<br>酷.新奇.好玩.品质</dd>
                            <dd style="margin-top: 13px;">微信添加"jguojguo"<br>获取我们的服务</dd>
                        </dl>
                        <dl>
                            <dt>免费试用</dt>
                            <dd>试用流程</dd>
                            <dd>如何提高成功率</dd>
                        </dl>
                        <dl>
                            <dt>友情链接</dt>
                            <dd>
                                <a href="#">智东西</a>
                                <a href="#">WEIBUSI</a>
                            </dd>
                            <dd>
                                <a href="#">搜狐IT</a>
                                <a href="#">腾讯科技</a>
                            </dd>
                            <dd>
                                <a href="#">搜狐数码</a>
                                <a href="#">凤凰科技</a>
                            </dd>
                            <dd>
                                <a href="#">凤凰数码</a>
                                <a href="#">PConline</a>
                            </dd>
                            <dd>
                                <a href="#">泡泡网</a>
                                <a href="#">3W咖啡</a>
                            </dd>
                            <dd>
                                <a href="#">ZUK社区</a>
                                <a href="#">亿觅emie</a>
                            </dd>
                            <dd>
                                <a href="#">极客公园</a>
                                <a href="#">易迅意启航</a>
                            </dd>
                            <dd>
                                <a href="#">果库</a>
                            </dd>
                        </dl>
                        <dl>
                            <dt>购买攻略</dt>
                            <dd><a href="#">美亚海淘教程</a></dd>
                            <dd><a href="#">日亚海淘教程</a></dd>
                            <dd><a href="#">海淘转运攻略</a></dd>
                            <dd><a href="#">kickstarter 众筹购买攻略</a></dd>
                            <dd><a href="#">indiegogo 众筹购买攻略</a></dd>
                        </dl>
                        <dl>
                            <dt>厂商合作</dt>
                            <dd><a href="#">关于极果</a></dd>
                            <dd><a href="#">联系我们</a></dd>
                            <dd><a href="#">商务合作：BD@jiguo.com</a></dd>
                            <dd><a href="#">CEO邮箱：CEO@jiguo.com</a></dd>
                        </dl>
                        <dl></dl>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- 回到顶部 -->
    <div class="back">
        <img src="./img/back.png" alt="">
    </div>
</body>

</html>
<script src="./js/index.js"></script>
<script>
    var swiper = new Swiper(".mySwiper", {
        slidesPerView: 4,
        spaceBetween: 30,
        freeMode: true,
        pagination: {
            el: ".swiper-pagination",
            clickable: true,
        },
        navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev",
        },
    });
</script>